
<div ng-module="ResultatsModule" id="resultats-recherche" class="container-fluid">
	<div ng-controller="ResultatsController as RT">
        <div id="resultats-filtres" class="row no-margin">

    		<div class="col-md-7">

    			<div class="row space-resultats-lignes">
    			    
    			    <div class="col-md-6 col-sm-6 col-xs-12 vcenter">
    			    	<multi-select
                                id="filtrePays"
                                default-label="Aucun pays sélectionné"    
                                input-model="RT.RechercheCl.filtrePays"    
                                button-label="libellePays"
                                item-label="libellePays"
                                tick-property="estSelect"
                                max-labels="3"
                                helper-elements=""
                                orientation="horizontal"
                                on-item-click="RT.msFiltrePaysChange( data )"
                        ></multi-select>
    			    </div><!--
    				--><div class="col-md-6 col-sm-6 col-xs-12 vcenter">
    			    	<multi-select
                                id="filtreRegions"
                                default-label="Aucune région sélectionnée"
                                input-model="RT.RechercheCl.filtreRegions"    
                                button-label="libelleRegions"
                                item-label="libelleRegions"
                                tick-property="estSelect"
                                max-labels="3"
                                helper-elements=""
                                orientation="horizontal"
                                group-property="paysGroup"
                                disable-property="checkboxDisabled"
                        ></multi-select>
    			    </div>
    			</div>

    			<div class="row space-resultats-lignes">
    			    
    			    <div class="col-md-12 col-sm-12 col-xs-12 vcenter">
    			    	<multi-select
                                default-label="Aucune activité sélectionnée"
                                input-model="RT.RechercheCl.filtreActivites"    
                                button-label="libelleAS"
                                item-label="libelleAS"
                                tick-property="estSelect"
                                max-labels="3"
                                helper-elements=""
                                orientation="horizontal"
                        ></multi-select>
    			    </div>

    			</div>

    			<div class="row space-resultats-lignes">
    			    
    			    <div class="col-md-12 col-sm-12 col-xs-12 vcenter">
    			    	<multi-select
                                default-label="Aucun thème sélectionné"
                                input-model="RT.RechercheCl.filtreThematiques"    
                                button-label="themeLibelle"
                                item-label="themeLibelle"
                                tick-property="estSelect"
                                max-labels="3"
                                helper-elements=""
                                orientation="horizontal"
                        ></multi-select>
    			    </div>

    			</div>

                <div class="row space-resultats-lignes">
                    
                    <div class="resultats-lignes col-md-12 col-sm-12 col-xs-12 vcenter">
                        <div class="input-group" style="width:100%;">
                            <tags-input ng-model="RT.RechercheCl.filtreTags" display-property="libelleFiltre" placeholder="Affinez votre recherche avec des mots clés" add-on-blur="true" replace-spaces-with-dashes="false">
                                <auto-complete source="RT.chargerLesFiltres($query)" debounce-delay="500" ></auto-complete>
                            </tags-input>
                        </div>
                    </div>

                </div>

    		</div><!-- fin form -->
        </div>

        <div id="resultats-container" class="row no-margin"><!-- résultats -->
            <div class="col-md-12">
                
                <div id="resultat-cpt" class="row">
                     <div class="col-md-12">
                        <div> {{RT.CatalogueCl.nombreSejour}} </div>
                    </div>
                </div>

                <div id="resultat-cpt" class="row ng-hide" ng-show="RT.CatalogueCl.catalogue.length == 0">
                     <div class="col-md-5">
                        <p class="font-weight-400">
                            Nous n'avons trouvé aucun résultat correspondant à vos critères, retirez quelques filtres pourrait suffire à donner des résultats.
                        </p>
                    </div>
                </div>

                <div id="resumeSejour" class="row">
                    <div class="row-space-2 col-md-4 col-sm-6 fadeInDown" ng-repeat="sejour in RT.CatalogueCl.catalogue | filter:fltResult">
                        <!-- ng-class="{'sejour-select': 1 == 1}" -->
                        <div class="effect-zoe panel-image listing-img" >
                            <!-- ng-click="RT.selectionnerSejour(sejour);" --> 
                            <div class="listing-img-container media-cover text-center">
                                <sejouraccueil th-id="{{sejour.sejourId}}" th-nom="{{sejour.sejourImage}}" th-libelle="{{sejour.sejourTitre}}"/>
                            </div>
                            <figcaption>
                                <div class="agence-logo">
                                    <agencelogo th-id="{{sejour.agenceId}}" th-nom="{{sejour.agenceImage}}" th-libelle="{{sejour.agenceLibelle}}"/>
                                </div>
                                <p class="icon-links">
                                    <!-- <a target="_blank" attr="href" linktosejour="//{{sejour.activiteLibelle}}-{{sejour.paysLibelle}}//{{sejour.sejourId}}-{{sejour.sejourTitre}}">
                                        <span class="icon-eye"></span>
                                    </a> -->
                                </p>
                                <p class="description">
                                    {{sejour.sejourTitre}}
                                </p>
                                <div class="lien-sejour">
                                    <a attr="href" class="link-invisible" linktosejour="//{{sejour.activiteLibelle}}-{{sejour.paysLibelle}}//{{sejour.sejourId}}-{{sejour.sejourTitre}}">
                                            Voir le séjour
                                    </a>
                                </div>
                            </figcaption>
                        </div>
                        <div class="panel-body panel-card-section">
                            <!-- <a class="pull-right media-photo media-round card-profile-picture-offset" href="javascript:void(0)">
                                <agencelogo th-id="{{sejour.agenceId}}" th-nom="{{sejour.agenceImage}}" th-libelle="{{sejour.agenceLibelle}}"/>
                            </a> -->
                            <a class="link-invisible" target="_blank" attr="href" linktosejour="//{{sejour.activiteLibelle}}-{{sejour.paysLibelle}}//{{sejour.sejourId}}-{{sejour.sejourTitre}}">
                                <div class="listing-name text-truncate row-space-top-1">
                                    {{sejour.sejourTitre}}
                                </div>
                            </a>
                            <div class="text-muted text-truncate">
                                <a class="link-invisible" target="_blank" attr="href" linktosejour="//{{sejour.activiteLibelle}}-{{sejour.paysLibelle}}//{{sejour.sejourId}}-{{sejour.sejourTitre}}">
                                    <span>{{sejour.activiteLibelle}}</span> <span ng-show="sejour.typeSejourLibelle"> - {{sejour.typeSejourLibelle}}</span> <span ng-show="sejour.sejourDuree"> - {{sejour.sejourDuree}} jours</span>
                                </a>
                            </div>
                        </div>

                    </div>
                </div>


            </div>
        </div><!-- résultats -->

    </div>
</div>
